<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>JS——正则表达式实例</title>
</head>
<body>
	<div style="font-size: 20px;">JS——正则表达式实例</div>
	<div>1、用户名</div>
	<input id="username" type="text">
	<div>2、密码强度</div>
	<input id="password" type="text">
	<div>3、email邮箱</div>
	<input id="email" type="text">
	<div>4、手机号</div>
	<input id="phone" type="text">
	<div>5、身份证</div>
	<input id="ID" type="text">
	<div></div>
	<div></div>
	<div></div>
	<div></div>
	<div></div>
	<div></div>
	<div></div>
	<div></div>
	<div></div>
	<div></div>
	<script type="text/javascript" src="jquery-3.3.1.js"></script>
	<script>
		// 用户名
		$('#username').blur(function(){
			var name = $('#username').val();
			var uPattern = /^[a-zA-Z0-9_-]{4,16}$/;
			if(uPattern.test(name)){
				alert('用户名可用')
			} else {
				alert('用户名为4到16位（字母，数字，下划线，减号）组成')
			}
		});
		// 密码强度正则
		$('#password').blur(function(){
			var name = $('#password').val();
			var uPattern = /^.*(?=.{6,})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/;
			if(uPattern.test(name)){
				alert('密码可用')
			} else {
				alert('密码最少6位，包括至少1个大写字母，1个小写字母，1个数字，1个特殊字符')
			}
		});
		// 邮箱验证
		$('#email').blur(function(){
			var name = $('#email').val();
			var uPattern = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
			if(uPattern.test(name)){
				alert('邮箱可用')
			} else {
				alert('邮箱格式不正确！')
			}
		});
		// 手机号验证
		$('#phone').blur(function(){
			var name = $('#phone').val();
			var uPattern = /^1[34578]\d{9}$/;
			if(uPattern.test(name)){
				alert('手机号可用')
			} else {
				alert('手机号格式不正确！')
			}
		});
		// 身份证验证
		$('#ID').blur(function(){
			var name = $('#ID').val();
			var uPattern = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
			if(uPattern.test(name)){
				alert('可用')
			} else {
				alert('身份证号（18位）格式不正确')
			}
		});
	</script>
</body>
</html>